import React,{useEffect} from 'react'
import * as action from "../action"
import {useSelector,useDispatch} from "react-redux" // useSelector可以来获取仓库中的数据
function App() {
 let dispatch = useDispatch() 
 let store = useSelector((state)=>{
    console.log(state);
    return {
        ...state.Appreducer

    }
})
useEffect(()=>{
    // 1. dispatch 调用action里的方法
    // 2 . 去action中写这个方法
    // 3. 去写对应的reducer
    dispatch(action.getlist())
},[])
let fn = ()=>{
     console.log( dispatch(action.setName("wangwu")) );
    // action 就是一个对象，对象里必须有一个字段叫type,剩下的字段随便规定，一般情况下叫payload
    //  dispatch() 
}
  return (
    <div>
        我的名字是{store.name}
        <button onClick={fn}>点击修改name</button>
        {
            store.arr && store.arr.length ? store.arr.map((item,index)=>{
                return <div key={index}>{item.name}</div>
            }):""
        }
    </div>
  )
}

export default App